<template>
  <div class="app-container">

    <el-tabs v-model="aynamicName" @tab-click="handleClick">
      <el-tab-pane label="个人动态" name="self">
        <self ref="self" :accountId="accountId"/>
      </el-tab-pane>
      <el-tab-pane label="帖子动态" name="post">
        <post ref="post" :accountId="accountId"/>
      </el-tab-pane>
    </el-tabs>

  </div>
</template>

<script>
import post from "@/components/UserInfo/dynamic/post"
import self from "@/components/UserInfo/dynamic/self"
export default {
  components:{
    post,
    self
  },
  data() {
    return {
      aynamicName: 'self',
      accountId: undefined
    };
  },
  created() {
    
  },
  methods: {
    init(accountId){
      this.accountId = accountId
      this.showComp(this.aynamicName)
    },
    handleClick(tab, event) {
      console.log(tab.name)
      this.showComp(tab.name)
    },
    showComp(name){
      switch (name) {
        case 'post':
          this.$refs.post.init(this.accountId)
          break;
        case 'self':
          this.$refs.self.init(this.accountId)
          break;
        default:
          break;
      }
    },
  }
};
</script>